<template>
	<view class="login">
		<view class="header">
			<text class="title">微信登录</text>
			<input class="input" type="text" value="微信号" />
			<input class="input" type="text" value="密码" />
			<!-- <button class="flexBtn" type="default">获取验证码</button> -->
			<button class="btn" type="default" @click="getUserInfo">微信登录</button>
		</view>
		
		<view class="footer">
			<text class="text1">登录代表您阅读并同意</text>
			<text class="text2">《E宠商城用户协议》</text>
		</view>
	</view>
</template>

<script>
	export default {
		methods:{
			// 一点击根据input输入内容 获取用户输入信息
			getUserInfo(){
				wx.getUserProfile({
					desc:'用于完善会员资料',//声明获取用户个人信息后的用途，后续会展示在弹框中，谨慎填写
					success:(res) => {
						console.log(res);
						// 保存用户信息到storage
						wx.setStorageSync('userInfo_key',res.userInfo)
						// 返回到个人中心页面
						wx.reLaunch({
							url:'/pages/center/center'
						})
					}
				})
			}
		}
	}
</script>

<style lang="stylus">
	.login
		display flex
		flex-direction column
		// align-items center
		// justify-content space-between
		padding 50rpx
		.header
			height 550rpx
			.title
				font-size 45rpx
				font-weight 600
			.input
				width 100%
				height 130rpx
				border-bottom 1rpx solid #A09C97
				color #767676
			.flexBtn
				position fixed
				top 290rpx
				left 490rpx
				width 200rpx
				height 60rpx
				color #4CD964
				font-size 28rpx
				line-height 60rpx
				border-radius 30rpx
				border 1rpx solid #4CD964
			.btn
				height 100rpx
				margin-top 60rpx
				color #767676
				background-color #DCDCDC
				border-radius 60rpx
		.footer
			height 80rpx
			margin-top 490rpx
			// background-color pink
			text-align center
			font-size 28rpx
			line-height 80rpx
			.text2
				color red
				
</style>
